export global HLClick {
    pure callback hl-clicked(string);
}

export component HyperLink inherits Text {
    in property<string> link-text;
    in property<string> url;
    in property<color> link-color;
    in property<color> hvr-color;

    text: root.link-text;

    hl-ta := TouchArea {
        clicked => { HLClick.hl-clicked(root.url)}
    }

    states [
        has-hvr when hl-ta.has-hover: {
            color: root.hvr-color;
        }
        not-hvr when !hl-ta.has-hover: {
            color: root.link-color;
        }
    ]

}